<template>
  <ekDialog
    v-model="ekVisiable"
    :title="title"
    @submit="handleSubmit"

  >
    <div class="ek-form" v-loading="loading">
      <el-form
        :model="form"
        :rules="rules"
        label-width="160px"
        ref="forms"
        :disabled="disabled"
        v-if="!loading"
      >
      
        <el-form-item prop="user_nick" label="地区名称">

          <el-input
            v-model="props.row.country_name"
            :disabled="true"
          />
        </el-form-item>
        <el-form-item prop="plan_id" label="币种">

            <ekSelectModel
                v-model="form.currency_code"
                :name="form.currency_code_model_text"
                :mapping="{
                    label: ['currency_name'],
                    value: 'currency_code',
                }"
                modelCode="MODEL_CURRENCY"
            />
        </el-form-item>
         
      </el-form>
    </div>
  </ekDialog>
</template>

<script setup>
import {
  watch,
  getCurrentInstance,
  computed,
  reactive,
  ref,
  defineEmits,
} from "vue";
import { apis } from "../data.js";
import ekDialog from "@/components/business/ekDialog/index.vue";
import ekInput from "@/components/form/ekInput/index.vue";
import ekSelect from "@/components/form/ekSelect/index.vue";
import ekTableSelect from "@/components/form/ekTableSelect/index.vue";
import ekSelectModel from "@/components/form/ekSelectModel/index.vue";
import { objectAssignment } from "@/utils/common.js";
const props = defineProps({
  // 显示隐藏
  visiable: {
    type: Boolean,
    default: false,
  },
  row: {
    type: Object,
    default: () => {},
  },
  title: {
    type: String,
    default: "",
  },
  disabled: {
    type: Boolean,
    default: false,
  },
});
const {
  appContext: {
    config: { globalProperties },
  },
} = getCurrentInstance();
const { $storage, $http, $ekLoading, $ekMessage } = globalProperties;

const emit = defineEmits(["update:visiable", "submit"]);

// 是否显示
const ekVisiable = computed({
  get() {
    return props.visiable;
  },
  set(value) {
    emit("update:visiable", value);
  },
});

function handleSubmit(done) {
  let url =apis.auth;
  forms.value.validate((valid) => {
    if (valid) {
      $http
        .request({
          url: url,
          method:  "PUT" ,
          data: {
            ...form.value,
          
          },
        })
        .then((res) => {
          $ekMessage.success(res.message);
          emit("submit", done);
        })
        .catch((err) => {});
    }
  });
}
const loading = ref(false);
let forms = ref(null);
let form = ref({
  currency_code:  props.row.currency_code,
  currency_code_model_text: props.row.currency_name,
  country_code: props.row.country_code,
});
const initForm = () => {
  form.value = {
    currency_code:  props.row.currency_code,
    currency_code_model_text: props.row.currency_name,
    country_code: props.row.country_code,
  };
};
let rules = reactive({
  currency_code: [
    { required: true, message: "请选择币种", trigger: "blur" },
  ],
});

watch(
  () => props.visiable,
  (val) => {
    if (val) {
      initForm();
    }
  }
);
</script>

<style scoped lang="scss"></style>
